<!DOCTYPE html>
<html lang="en" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro"
      xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="/layuiadmin/layui/css/layui.css">
    <link rel="stylesheet" href="/layuiadmin/style/admin.css">
</head>
<body>
<div class="layui-fluid">
    <div class="druger_table_div">
        <div id="searchParam">
            <div class="layui-form-item">
                <div class="layui-input-inline">
                    <input type="text" id="name" class="layui-input"  autocomplete="off" placeholder="请输入姓名">
                </div>
                <div class="layui-input-inline">
                    <input type="text" id="cardNo" class="layui-input"  autocomplete="off" placeholder="请输入身份证号码">
                </div>
                <div class="layui-input-inline layui-form">
                    <select  id="cid"  >
                        <option value="">请选择所在社区</option>
                        <option value="1">和平社区</option>
                        <option value="2">新和社区</option>
                        <option value="3">桥头社区</option>
                        <option value="4">塘尾社区</option>
                        <option value="5">大洋社区</option>
                        <option value="6">新田社区</option>
                        <option value="7">稔田社区</option>
                    </select>
                </div>
                <div class="layui-input-inline">
                    <input type="text" id="gridName" class="layui-input"  autocomplete="off" placeholder="请输入网格名称">
                </div>
                <div class="layui-input-inline">
                    <input type="text" class="layui-input" id="createTime" placeholder="创建时间">
                </div>
                <div class="layui-input-inline layui-form">
                    <select  id="status"  >
                        <option value="">请选择状态</option>
                        <option value="0">正常</option>
                        <option value="-1">禁用</option>
                    </select>
                </div>
                <div class="layui-input-inline ">
                    <button class="layui-btn" id="search"><i class="layui-icon layui-icon-search"></i>查询</button>
                    <button class="layui-btn" id="export"><i class="layui-icon layui-icon-download-circle"></i>导出</button>
                </div>
            </div>
        </div>
        <table class="layui-hide" id="druger_table" lay-filter="druger_table"></table>
        <div id="laypage" class="layui-box layui-laypage layui-laypage-default"></div>
    </div>
</div>
</body>
<script type="text/html" id="toolbar">
    <div class="layui-btn-group">
        <button type="button" class="layui-btn" lay-event="add">
            <i class="layui-icon layui-icon-addition"></i> 新增
        </button>
    </div>
    <div class="layui-btn-group">
        <button type="button" class="layui-btn" lay-event="batchDeleted">
            <i class="layui-icon layui-icon-delete"></i> 批量删除
        </button>
    </div>
</script>
<script type="text/html" id="tool">
    <a class="layui-btn layui-btn-xs" lay-event="detail"><i class="layui-icon layui-icon-tabs"></i>详细</a>
    <a class="layui-btn layui-btn-xs" lay-event="edit"><i class="layui-icon layui-icon-edit"></i>编辑</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs"  lay-event="del"><i class="layui-icon layui-icon-delete"></i>删除</a>
</script>
<!--头像-->
<script type="text/html" id="imgTpl">
    {{#  if(d.pic!=null){ }}
        <img class="head" src="{{d.pic}}"  style="width:30px; height:30px;">
    {{#  } }}
</script>
<script src="/layuiadmin/layui/layui.js"></script>
</html>
<script>
    layui.config({
        base: '/layuiadmin/'//静态资源所在路径
    }).extend({
        CoreUtil : 'core-util/CoreUtil'
    }).use(['table','laypage', 'layer','laydate','tree','transfer','CoreUtil'], function(){
        var table = layui.table;
        var laypage = layui.laypage;
        var form = layui.form;
        var layer = layui.layer;
        var $ = jQuery = layui.jquery;
        var laydate = layui.laydate;
        var transfer=layui.transfer;
        var CoreUtil = layui.CoreUtil;
        var searchParam= {
            name:null,
            cardNo:null,
            status:null,
            cid:null,
            gridName:null,
            cid:null,
            startTime:null,
            endTime:null,
            pageNum:1,
            pageSize:10
        };
        /**
         * 翻页
         * @param count
         * @param currentPage
         */
        var laypageTable = function(count) {
            laypage.render({
                elem: 'laypage'
                ,count: count
                ,limit:searchParam.pageSize
                ,layout: ['count', 'prev', 'page', 'next', 'limit', 'skip']
                ,limits:[10, 20, 30, 40, 50]
                ,curr: location.hash.replace('#!currentPage=', '') //获取起始页
                ,hash: 'currentPage' //自定义hash值
                ,jump: function (obj,first) {
                    if (!first){
                        searchParam.pageNum=obj.curr;
                        searchParam.pageSize=obj.limit;
                        getTableData(false);
                    }
                }
            });
        };
        //渲染table
        var loadTable=function (data) {
            table.render({
                elem: '#druger_table'
                ,cols: [
                    [
                        {type: 'checkbox', fixed: 'left'},
                        //{field: 'id', title: 'ID', width: 300, sort: true},
                        {field: 'pic', title: '头像',templet: '#imgTpl', width: 60},
                        {field: 'name', title: '姓名'},
                        {field: 'sex', title: '性别',templet:function (item) {
                                if(item.sex==1){
                                    return "男"
                                }else{
                                    return "女"
                                }
                            }
                        },
                        {field: 'gname', title: '网格名称'},
                        {field: 'cname', title: '社区名称'},
                        {field: 'birthday', title: '生日'},
                        {field: 'cardNo', title: '身份证号码'},
                        {field: 'phone', title: '联系方式'},
                        {field: 'marry', title: '婚姻',templet:function(item){
                                if(item.marry==1){
                                    return "已婚"
                                }else{
                                    return "未婚"
                                }
                            },hide:true
                        },
                        {field: 'education', title: '文化程度',hide:true},
                        {field: 'nation', title: '民族',hide:true},
                        {field: 'workerName', title: '所属社工',hide:true},
                        {field: 'workerPhone', title: '社工电话',hide:true},
                        {field: 'liveStatus', title: '居住情况',templet:function(item){
                                if(item.liveStatus==1){
                                    return "独居"
                                }else if(item.liveStatus==2){
                                    return "与家人居住"
                                }else{
                                    return "与朋友/同事合租"
                                }
                            },hide:true},
                        {field: 'workStatus', title: '就业情况',hide:true},
                        {field: 'address', title: '居住地址',hide:true},
                        {field: 'domicile', title: '户籍',hide:true},
                        {field: 'intoDate', title: '搬入时间',hide:true},
                        {field: 'outDate', title: '搬出时间',hide:true},
                        {field: 'firstTime', title: '初次发现时间',hide:true},
                        {field: 'type', title: '毒品类型',hide:true},
                        {field: 'controlArea', title: '当前管控地区',hide:true},
                        {field: 'controlStatus', title: '管控现状',hide:true},
                        {field: 'exhortStatus', title: '管控类型',hide:true},
                        {field: 'grade', title: '风险等级',templet:function(item){
                                if(item.grade==1){
                                    return "极端风险"
                                }else if(item.grade==2){
                                    return "高风险"
                                }else if(item.grade==3){
                                    return "中风险"
                                }else{
                                    return "低风险"
                                }
                            },hide:true},
                        {field: 'memo', title: '备注',hide:true},
                        {field: 'status', title: '管辖状态',hide:true},
                        {field: 'createTime', title: '创建时间'},
                        {field: 'updateTime', title: '更新时间'},
                        {width:300,toolbar:"#tool",title:'操作'}
                    ]
                ]
                ,data: data
                ,even: true
                ,limit: data.length
                ,limits: [10, 20, 30, 40, 50]
                ,toolbar:'#toolbar'

            });
        };
        /**
         * 分页获取数据
         */
        var getTableData = function(flag){
            CoreUtil.sendAjax("/manager/drugers",searchParam,function (res) {
                if(res.data.list !=null){
                    if(flag){laypageTable(res.data.totalRows);}
                    loadTable(res.data.list);
                }
            },"GET",false,false);
        };

        /**
         *获取一次数据
         */
        getTableData(true);
        /**
         * 时间切换
         */
        laydate.render({
            elem: '#createTime'
            ,type: 'datetime'
            ,range: '~'
            ,done: function(value, date, endDate){
                if(value !=null && value != undefined && value != ""){
                    searchParam.startTime=value.split("~")[0];
                    searchParam.endTime=value.split("~")[1];
                }else {
                    searchParam.startTime=null;
                    searchParam.endTime=null;
                }

            }
        });
        /**
         * 搜索
         */
        $("#search").click(function () {
            searchParam.name=$("#name").val();
            searchParam.cardNo=$("#cardNo").val();
            searchParam.status=$("#status").val();
            searchParam.cid=$("#cid").val();
            searchParam.gridName=$("#gridName").val();
            searchParam.pageNum=1;
            getTableData(true);
        });
        /**
         * 将json参数拼接成url参数
         */
        var parseParam = function(obj) {
            var ary = [];
            for (var p in obj)
                if (obj.hasOwnProperty(p) && obj[p]) {
                    ary.push(encodeURIComponent(p) + '=' + encodeURIComponent(obj[p]));
                }
            return ary.join('&');
        };

        $("#export").click(function(){
            searchParam.name=$("#name").val();
            searchParam.cardNo=$("#cardNo").val();
            searchParam.status=$("#status").val();
            searchParam.cid=$("#cid").val();
            searchParam.gridName=$("#gridName").val();
            window.location = "/manager/druger/export?"+parseParam(searchParam);
        })

        /**
         * 头部工具栏
         */
        table.on('toolbar(druger_table)', function(obj){
            console.log(obj)
            var checkStatus = table.checkStatus(obj.config.id);
            switch(obj.event){
                case 'batchDeleted':
                    var checkStatus = table.checkStatus(obj.config.id);
                    var data = checkStatus.data;
                    if(data.length==0){
                        layer.msg("请选择要批量删除的人员");
                    }else {
                        var userIds = [];
                        $(data).each(function (index,item) {
                            userIds.push(item.id);
                        });
                        tipDialog(userIds,"选中的人员");
                    }
                    break;
                case 'add':
                    var ifr = layer.open({
                        title: "新增吸毒人员",
                        type: 2,
                        content: '/home/app/druger/form',
                        area: ['300px', '300px'],
                        maxmin: true,
                        success: function (layero, index) {
                            // 获取子页面的iframe
                            var iframe = window['layui-layer-iframe' + index];
                            // 向子页面的全局函数child传参
                            iframe.drugerForm(null)
                        }
                    });
                    layer.full(ifr);
                    break;
            };
        });
        /**
         * table 列工具栏
         */
        table.on('tool(druger_table)',function (obj) {
            console.log(obj)
            var data = obj.data;
            switch (obj.event) {
                case 'del':
                    var userIds=[];
                    userIds.push(data.id);
                    tipDialog(userIds,data.name);
                    break;
                case 'detail':
                    var ifr = layer.open({
                        title: "吸毒人员详细",
                        type: 2,
                        content: '/home/app/common/detail',
                        area: ['300px', '300px'],
                        maxmin: true,
                        success: function (layero, index) {
                            // 获取子页面的iframe
                            var iframe = window['layui-layer-iframe' + index];
                            // 向子页面的全局函数child传参
                            iframe.detail(data.id,"druger")
                        }
                    });
                    layer.full(ifr);
                    break;
                case 'edit':
                    var ifr = layer.open({
                        title: "更新吸毒人员",
                        type: 2,
                        content: '/home/app/druger/form',
                        area: ['300px', '300px'],
                        maxmin: true,
                        success: function (layero, index) {
                            // 获取子页面的iframe
                            var iframe = window['layui-layer-iframe' + index];
                            // 向子页面的全局函数child传参
                            iframe.drugerForm(data);
                        }
                    });
                    layer.full(ifr);
                    break;
            }
        });
        $("#btn_cancel").click(function() {
            $(".user_table_div").show();
            $(".operation_user").hide();
            return false;
        });

        var tipDialog = function (userIds,username) {
            layer.open({
                content: '确定要删除['+username+"]么?",
                yes: function(index, layero){
                    layer.close(index); //如果设定了yes回调，需进行手工关闭
                    CoreUtil.sendAjax("/manager/druger",JSON.stringify(userIds),function (res) {
                        layer.msg(res.msg);
                    },"DELETE",'application/json; charset=UTF-8',false);
                }
            });
        };

        form.on('switch(switch)', function(){
            $(".operation_user input[name=status]").attr('type', 'hidden').val(this.checked ? 0 : -1);
        });
        form.on('submit(submit)', function(data){
            console.log(data);
            if(data.field.id===undefined || data.field.id===null || data.field.id===""){
                CoreUtil.sendAjax("/manager/admin",JSON.stringify(data.field),function (res) {
                    $(".user_table_div").show();
                    $(".operation_user").hide();
                    getTableData();
                },"POST",'application/json; charset=UTF-8',false);
            }else {
                CoreUtil.sendAjax("/manager/admin",JSON.stringify(data.field),function (res) {
                    $(".user_table_div").show();
                    $(".operation_user").hide();
                    getTableData();
                },"PUT",'application/json; charset=UTF-8',false);
            }
            return false;
        });
        var initTransfer=function (data) {
            transfer.render({
                elem: '#roles'
                ,data: data.allRole
                ,title: ['赋予角色', '拥有角色']
                ,showSearch: true
                ,value:data.ownRoles
                ,id: 'ownData'
                ,parseData: function(res){
                    return {
                        "value": res.id //数据值
                        ,"title": res.name //数据标题
                    }
                }
            })
        }
    });
</script>
